import { AllHTMLAttributes, createElement, type FC } from 'react';
import classNames from 'classnames';

import { headerDefaultProps } from './defaultProps';
import type { HeaderOptions } from './type';

export interface HeaderProps extends HeaderOptions, Omit<AllHTMLAttributes<HTMLElement>, 'as' | 'size'> {}

const Header: FC<HeaderProps> = (props) => {
  const { className, as, size, children, forwardedRef, ...headerProps } = props;

  return createElement(
    as!,
    { ref: forwardedRef, className: classNames('ui', size, 'header', className), ...headerProps },
    children,
  );
};

Header.displayName = 'Header';
Header.defaultProps = headerDefaultProps;

export default Header;
